<!doctype html>
<html>

<head>
    <meta charset="UTF-8">
    <title></title>
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
    <link href="css/mui.min.css" rel="stylesheet"/>
    <link href="css/popPay.css" rel="stylesheet">
    <link rel="stylesheet" href="css/antui.min.css"/>
    <style>
        .confirm-pay .mui-table-view {
            background-color: white;
        }

        .confirm-pay .mui-table-view-cell {
            padding: 0;
            background-color: white;
        }

        .confirm-title {
            font-family: '楷体';
            font-weight: bold;
            width: 100%;
            height: 50px;
            color: #0062CC;
            font-size: 20px;
            text-align: center;
            line-height: 50px;
            border-bottom: 1px silver solid;
        }
    </style>
</head>

<body>
<header class="mui-bar mui-bar-nav">
    <a class="mui-action-back mui-pull-left"></a>
    <h1 class="mui-title">交易信息</h1>
    <span class="mui-icon mui-icon-close mui-pull-right" onclick="window.history.go(-2);"></span>
</header>
<div class="mui-content">
    <div class="select-card" id="select-card" style="display: none;">
        <div class="mui-card">
            <div class="mui-input-group">
                <div class="mui-input-row">
                    <label style="width: 100%;">绑卡快捷支付:</label>
                </div>
                <div class="mui-input-row mui-text-center add-new-card" style="margin-top: 10px; width: 100%;">
                    <button style="border: none;" id="addBindCard">添加新银行卡</button>
                </div>
            </div>
        </div>
    </div>
    <!--<div class="mui-input-row mui-checkbox mui-left" style="font-size: 14px;">-->
    <!--<label>记住卡信息，下次可一键快捷支付</label>-->
    <!--<input name="checkbox" id="rememberCard" type="checkbox">-->
    <!--</div>-->
    <button type="button" id="confirm-btn" data-loading-text="提交中" class="mui-btn mui-btn-primary confirm-btn"
            style="width: 90%;height:40px;font-size: 16px;margin-left: 5%;">确认信息
    </button>
</div>

<!--确认支付-->
<div id="forward" class="mui-popover mui-popover-action mui-popover-bottom">
    <div style="width: 100%;height:254px;background-color: white;">
        <div class="confirm-title">
            确认支付
        </div>
        <div class="mui-input-group">
            <div class="mui-input-row">
                <label>支付金额</label>
                <input disabled type="text" id="amount" class="mui-input-clear" placeholder=""
                       data-input-clear="5"><span class="mui-icon mui-icon-clear mui-hidden"></span>
            </div>
            <div class="mui-input-row">
                <label>订单编号</label>
                <input disabled type="text" id="order_no" class="mui-input-clear" placeholder=""
                       data-input-clear="5"><span class="mui-icon mui-icon-clear mui-hidden"></span>
            </div>
            <div class="mui-input-row" id="bank_num_row">
                <label>支付卡号</label>
                <input disabled type="text" id="bank_num_li" class="mui-input-clear" placeholder=""
                       data-input-clear="5"><span class="mui-icon mui-icon-clear mui-hidden"></span>
            </div>
            <div class="mui-input-row">
                <label>验证码</label>
                <input type="text" id="sms_code_input" class="mui-input-clear" placeholder="验证码" data-input-clear="5"
                       style="width: 30%;float: left;">
                <span class="mui-icon mui-icon-clear mui-hidden"></span>
                <button data-loading-text=" " class="mui-btn code-btn" style="float: left;border: none;width: auto;"
                        id="sms_code_btn">获取验证码
                </button>
            </div>
        </div>
        <div>
            <button data-loading-text="提交中" class="mui-btn mui-btn-danger"
                    style="width: 100%;border-radius: 0;font-size: 16px;position: absolute;left: 0px;bottom: 0px;height: 44px;">
                确定支付
            </button>
        </div>
    </div>
</div>
<div id="from-hidden" style="display: none">
</div>
<div class="qr alipay">
    <div class="qr_header">
        <img src="img/alipay.png"/>
    </div>
    <div class="amount"><span>爱卡卡极速收款</span><br/>金额￥<span class="money">0</span></div>
    <!--<div class="amount"></div>-->
    <img class="qr_img" src=""/>
    <div class="tip_text">
        <p class="web-font">请使用支付宝扫描上方二维码</p>
    </div>
    <img src="img/close.png" class="close">
    <div class="tips">
        <div class="tip">
            <span>1</span>
            <img src="img/p1.png">
        </div>
        <div class="tip">
            <span>2</span>
            <img src="img/p2.png">
        </div>
        <div class="tip">
            <span>3</span>
            <img src="img/p3.png">
        </div>
    </div>
</div>
<div class="qr wechat">
    <div class="qr_header">
        <img src="img/WePayLogo.png"/>
    </div>
    <div class="amount"><span>爱卡卡极速收款</span><br/>收款金额￥<span class="money">56</span></div>
    <img class="qr_img" src=""/>
    <div class="tip_text">
        <p class="web-font">请使用微信扫描上方二维码</p>
    </div>
    <img src="img/close.png" class="close">
    <div class="tips">
        <div class="tip">
            <span>1</span>
            <img src="img/p1.png">
        </div>
        <div class="tip">
            <span>2</span>
            <img src="img/p2.png">
        </div>
        <div class="tip">
            <span>3</span>
            <img src="img/p3.png">
        </div>
    </div>
</div>
<div class="mui-popup-backdrop mui-active" style="display: none; background-color: transparent;">
    <div class="am-toast">
        <div class="am-toast-text">
            <span class="am-icon toast loading"></span> 加载中
        </div>
    </div>
</div>
<script src="js/mui.min.js"></script>
<script src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/validateutil.js"></script>
<script src="js/base64.js"></script>
<script src="js/hkpay.js"></script>
<script type="text/javascript">
    mui.init({
        swipeBack: true //启用右滑关闭功能
    });
    mui.ready(function () {
        mui.get("/thmlfApi/avs/pay/accessbanklist?gateway=" + gateway + "&_d=" + Date.parse(new Date()), null, function (r) {
            $("#bankList").find("option").remove();
            mui.each(r.result, function (index, item) {
                $("#bankList").append("<option value='" + item.bankCode + "'>" + item.bankName + "</option>");
            })
        }, 'json');
    });
</script>
</body>

</html>